CSSの基本（2）−クラスを使ってCSSを指定する
前回の講座では、同じタグにCSSを一括指定する方法を学習しました。ただし、この方法では全てのタグが同じ書式で表示されてしまいます。そこで今回の講座では、タグをクラスで分類し、クラスに対してCSSを指定する方法を紹介します。 サンプルページ

→ タグにクラス名を付ける
 
クラスを利用してCSSを指定する場合は、各タグにclass属性を追加し、その名前でタグをクラス分けします。たとえば、以下はIMGタグを2つにクラスに分けた例です。1つ目と3つ目のIMGタグはclass属性の値が"green"ですので、"green"のクラスに属します。同様に、2つ目のIMGタグは"red"のクラス。4つ目のIMGタグは、class属性がないためいずれのクラスにも属しません。なお、それぞれのクラス名は半角の英数字でれば自由に命名することが可能です。
　　：
<IMG class="green" src="photo01.jpg">
　　 ：
<IMG class="red" src="photo02.jpg">
　　 ：
<IMG class="green" src="photo03.jpg">
　　 ：
<IMG src="photo04.jpg">
　　 ：
  


→ クラスに対してCSSを指定する
 
続いて、クラスに対してCSSを指定する方法を紹介します。クラスに対してCSSを指定する場合は、以下のように（タグ名）.（クラス名）{…}という具合にCSSを記述します。この例では、クラス名"green"のIMGタグを「緑色の二重線」で表示、クラス名"red"のIMGタグを「赤色の二重線」で表示、という書式を指定しました。なお、クラス名が指定されていないIMGタグは、初期設定の書式、すなわち「枠線なし」で表示されます。
<STYLE type="text/css">
IMG.green{
border:double 6px #009900;
}
IMG.red{
border:double 6px #FF0000;
}
</STYLE>
 サンプルページ


�e�����[�N����EC�i�r Yahoo �y�V LINE���f�[�^�����[�������z500�~�`�I
�����z�[���y�[�W �������N���W�b�g�J�[�h �C�O�i���q�����@�C�O���s�����������I �C�O�z�e��